Q1:JS可以放在哪个位置?
A1:
1.放在<head>标签中,用<script type="text/javascript"></script>来标志这是一段JS代码;
2.放在外部文件中,文件后缀名为.js,用<script src="xx.js" />将外部文件引进HTML;
3.写在HTML的<body>标签中,通过<script type="text/javascript"></script>来标志这是一段JS代码;
Q2:JS注释怎么写?
A2:JS的注释与Java注释相同,"//"是单行注释,"/* */"是多行注释;
Q3:什么是变量?
A3:变量就是用来存储数值的容器;
JS中定义变量的方法:var a; //定义一个变量a,类型为var(注意:JS中所有变量类型都为var)
给变量赋值:a = 1;
也可以对变量同时定义和赋值:var a = 1;
Q4:JS中的分支判断语句怎么用?
A1:分支判断语句:
if(exp1)
{
//满足exp1时的操作
}
else
{
//不满足exp1时的操作
}
举个栗子:
1 var a = "man"; //定义一个变量a,并给他赋值为字符串"man"; 2 if(a == "man") //如果a 的值等于"man",执行下面花括号内的代码; 3 { 4 alert("男生!"); //弹窗显示"男生!"; 5 } 6 else if(a == "woman") //如果a 的值等于"woman",执行下面花括号内的代码; 7 { 8 alert("女生!"); //弹窗显示"女生!"; 9 } 10 else //前面所有的if都不符合 11 { 12 alert("人妖!"); //弹窗显示"人妖!"; 13 }
Q5:什么是函数?
A5:函数是完成某个特定功能的代码块;
解释:我们把完成特定功能的代码放到一个代码块里,给它起个名字,以后用到就直接通过名字来调用;
定义函数:
function 函数名()
{
//函数代码;
}
举个栗子:
1 function add() 2 { 3 //这个函数的作用是将两个数相加,并弹窗显示 4 var a = 1; 5 var b = 2; 6 var sum = a + b; 7 alert(sum); 8 }
Q6:JS中常见的内置方法有哪些?
A6:
1.document.write("显示在页面上的文字"); //直接向HTML输出流写内容,即直接显示在页面上
2.alert("弹窗显示的文字"); // 警告对话框(消息对话框)
3.conform(); // 确认对话框(有返回值和参数,详见例子)
4.prompt(); // 提问对话框(有返回值和参数,详见例子)
5.window.open(); // 打开新窗口(多个可选参数)
6.window.close(); // 关闭当前窗口(如果想关闭指定窗口则先获取指定窗口对象obj,再使用此方法关闭,obj.close();)
举个栗子:
1 <script type="text/javascript"> 2 var result = confirm("你是男生吗?"); //点击确认按钮返回true, 3 if(result == true) 4 { 5 alert("你是男生"); 6 } 7 else 8 { 9 alert("你是女生"); 10 } 11 </script>
1 <script type="javascript"> 2 function tiwen() 3 { 4 var obj = prompt("你叫什么名字?","小华"); //obj为输入框中输入的值,默认为第二个参数值:"小华" 5 alert(obj); //警告弹框显示结果 6 } 7 </script>
1 <script type="javascript"> 2 function openwindow(){ 3 var obj = window.open("http://www.baidu.com","_blank","width=600px,height=300px,top=500px,left=500px"); 4 } 5 </script>
1 <script type="javascript"> 2 function clozen() { 3 var obj = var obj = window.open("http://www.baidu.com","_blank","width=600px,height=300px,top=500px,left=500px"); 4 obj.close(); //关闭指定对象 5 6 window.close(); //关闭当前窗口 7 } 8 </script>
Q7:常用的获取DOM节点的方法:
A7:
1. var a = document.getElementById("id的值"); //通过标签的id属性获取该节点
2. var b = document.getElementsByName("name的值"); //通过标签的name属性获取节点
3. var c = document.getElelentsByTagName("标签名称"); //通过标签名称获取节点
举个栗子:
1 function getNode(){ 2 var a = document.getElementById("add"); 3 var b = document.getElementsByName("confirm"); 4 var c = document.getElementsByTagName("input"); 5 alert(a); 6 alert(b); 7 alert(c); 8 }
Q8:如何操纵DOM节点来改变HTML的内容和样式?
A8:
1.通过节点的innerHTML属性来获取和改变标签内的文本:
举个栗子:
1 function changeDOM() 2 { 3 var divdom = document.getElementById("title1"); 4 var text = divdom.innerHTML; 5 alert(text); 6 divdom.innerHTML = "变成标题二"; 7 alert(divdom.innerHTML); 8 }
2.通过节点的style属性改变样式:
举个栗子:
1 <p id="pcon">Hello World!</p> 2 <script> 3 var mychar = document.getElementById("pcon"); 4 mychar.style.color="red"; //颜色设为红色 5 mychar.style.fontSize="20"; //字体大小设为20; 6 mychar.style.backgroundColor ="blue"; //背景颜色设为蓝色 7 mychar.style.display="none"; //隐藏标签块 8 mychar.style.display="block"; //显示标签块 9 </script>
3.通过给节点的class赋值来增加节点的样式:
举个栗子:
1 <style type="text/css"> 2 .style1{ 3 color:red; 4 font-size:20; 5 backgroundColor:blue; 6 } 7 </style> 8 <p id="pcon">Hello World!</p> 9 <script> 10 var mychar = document.getElementById("pcon"); 11 mychar.className = "style1"; 12 </script>